import React from "./react";
import ReactDOM from "./react-dom/client";
class RegularComp extends React.Component {
  render() {
    console.log(`Rendering RegularComp`);
    return <div>{this.props.value}</div>;
  }
}
// PureComponent 会判断 属性 状态，是否会变，不变就不更新，变了才更新

// 属性 状态固定，第一次渲染，后续更新不渲染
class PureComp extends React.PureComponent {
  render() {
    console.log(`Rendering PureComponent`);
    return <div>{this.props.value}</div>;
  }
}
class App extends React.Component {
  state = { data: { value: 1 } };
  render() {
    return (
      <div>
        <button onClick={() => this.setState({ data: this.state.data })}>
          +
        </button>
        <RegularComp value={this.state.data.value} />
        <PureComp value={this.state.data.value} />
      </div>
    );
  }
}
const root = ReactDOM.createRoot(document.getElementById("root"));
root.render(<App />);

// pure 对比原理 https://blog.csdn.net/qq_38951259/article/details/145282525
